<template>
    <el-dialog title="跟投管控标准" :visible.sync="show" width="70%" @close="$emit('update:visible', false)">
        <el-table border :data="newTableData" :span-method="arraySpanMethod" style="text-aling:center">
            <el-table-column property="section" label="投入金额区间">
                <template slot-scope="scope">
                    {{scope.row.inMax?`${scope.row.inMini}元（含）- ${scope.row.inMax}元（不含）`:`≥ ${scope.row.inMini}元`}}
                </template>
            </el-table-column>
            <el-table-column property="inRooted" label="主体类型" :formatter="typeFormatter"></el-table-column>
            <el-table-column property="inBole" label="主体名称"></el-table-column>
            <el-table-column property="inLeaf" label="跟投额度比例" :width="130">
                <template slot-scope="scope">
                    {{scope.row.inLeaf}}%
                </template>
            </el-table-column>
        </el-table>
        <template slot="footer">
            <el-button @click="show = false">关 闭</el-button>
        </template>
    </el-dialog>
</template>
<script>
    import api from '@/api/apiPath'

    export default {
        components: {},
        data() {
            return {
                spanArr: [],
                pos: 0,
                show: false,
            }
        },
        props: ["tableData", "visible"],
        watch: {
            visible(o, n) {
                this.show = o;
            }
        },
        methods: {
            //合并列
            getSpanArr(data) {
                this.spanArr = []
                for (var i = 0; i < data.length; i++) {
                    if (i === 0) {
                        // 如果是第一条记录（即索引是0的时候），向数组中加入１
                        this.spanArr.push(1)
                        this.pos = 0;
                    } else {
                        if (data[i].idx === data[i - 1].idx) {
                            // 如果idx相等就累加，并且push 0
                            this.spanArr[this.pos] += 1
                            this.spanArr.push(0)
                        } else {
                            // 不相等push 1
                            this.spanArr.push(1)
                            this.pos = i
                        }
                    }
                }
            },

            arraySpanMethod({row, column, rowIndex, columnIndex}) {
                if (columnIndex === 0) {
                    const _row = this.spanArr[rowIndex];
                    const _col = _row > 0 ? 1 : 0
                    return {
                        rowspan: _row,
                        colspan: _col
                    }
                }
            },
            typeFormatter(row, column, cellValue, index) {
                return ['内部法人', '渠道/经纪', '开发商', '内部员工'][cellValue];
            }
        },
        computed: {
            newTableData() {
                let data = [];
                this.tableData.forEach((form, idx) => {
                    form.rows.forEach(opc => {
                        let {inMax, inMini} = form;
                        let {inRooted, inBole, inLeaf} = opc
                        data.push({idx: idx, inMini, inMax, inRooted, inBole, inLeaf})
                    })
                })
                this.getSpanArr(data);
                return data;
            }
        },

        created() {
        },
        destroyed() {

        },
        filters: {}
    }

</script>

<style lang="stylus" scoped>

</style>
